import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import '@/styles/index.scss'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import SvgIcon from '@/icons'
// 引入路由守卫 permission
import '@/router/permission'
// 引入i18n
import i18n from '@/i18n'
import Hint from '@/components/Hint'
import Sensor from '@/components/Sensor'
import filters from './utils/filters'
import Graph from '@/components/Graph'

// 导入element-plus样式
import 'element-plus/dist/index.css'

import lazyPlugin from 'vue3-lazy'
import pic from '@/assets/defaultCodePic.jpg'

import VueVideoPlayer from '@videojs-player/vue'
import 'video.js/dist/video-js.css'

import 'element-plus/theme-chalk/dark/css-vars.css'
import '@/styles/dark/css-vars.css'

const app = createApp(App)
// 这个遍历图标注册为全局组件还可以使用for in
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}
SvgIcon(app)
app.component('hint-button', Hint)
app.component('sensor', Sensor)
app.component('graph', Graph)
filters(app)
app
  .use(store)
  .use(router)
  .use(i18n)
  .use(lazyPlugin, {
    loading: pic
  })
  .use(VueVideoPlayer)
  .mount('#app')
